<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    body{background:black;margin:0;}
  </style>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" width="100vw" height="100vh">
  <defs>
    <!--
      fx fy是焦点的位置 默认在中心
    -->
    <radialGradient id="grad1" cx="0.5" cy="0.5" r="0.5" fx="0.6" fy="0.3">
      <stop offset="0" stop-color="rgb(20,151,252)"></stop>
      <stop offset="0.5" stop-color="rgb(164,105,190)"></stop>
      <stop offset="1" stop-color="rgb(255,140,0)"></stop>
    </radialGradient>
  </defs>
  <rect x="100" y="100" fill="url(#grad1)" width="200" height="150"></rect>
</svg>
</body>
</html>
